import { reactive, markRaw } from 'vue'
import type { CTableProps } from '@/components/CTable'
import type { BasicPagingListParams } from '@/apis/basicModel'
import type { SearchOptionsType, TableFieldsSettingType } from '@/components/CPageTable'
import {
  TodoTaskStatusEnum,
  TodoTaskStatusOptions,
  ProcessDefinitionOptions
} from '@/constants/enum'
import { getTodoList, getDoneList, getCommitList } from '@/apis/todo/flow'

export const useTodoList = (handleUpdate: () => void) => {
  // 搜索字段及其他
  const searchForm = reactive({
    processDefinitionKey: '',
    status:
      (sessionStorage.getItem('todoListType') as keyof typeof TodoTaskStatusEnum) ||
      ('PENDING' as keyof typeof TodoTaskStatusEnum)
  })

  // 搜索配置
  const searchOptions: SearchOptionsType[] = markRaw([
    {
      name: '待办状态',
      field: 'status',
      type: 'headerTab',
      headerTabList: TodoTaskStatusOptions
    },
    {
      name: '流程',
      field: 'processDefinitionKey',
      type: 'sidebar',
      options: ProcessDefinitionOptions
    }
  ])

  // 表格配置
  const tableOptions: CTableProps = {
    loadData
  }

  function loadData(parameter: BasicPagingListParams) {
    const params = {
      current: parameter.current,
      size: parameter.size,
      processDefinitionKey: searchForm.processDefinitionKey
    }
    handleUpdate()
    switch (searchForm.status) {
      case TodoTaskStatusEnum.PENDING:
        return getTodoList(params)
      case TodoTaskStatusEnum.PROCESSED:
        return getDoneList(params)
      case TodoTaskStatusEnum.SUBMITTED:
        return getCommitList(params)
      case TodoTaskStatusEnum.OUT_OF_TIME:
        Object.assign(params, { dueFlag: 'DUE' })
        return getTodoList(params)
      case TodoTaskStatusEnum.ABOUT_TO_EXPIRE:
        Object.assign(params, { dueFlag: 'NEAR_DUE' })
        return getTodoList(params)
      default:
        return getTodoList(params)
    }
  }

  const tableFieldsSetting: TableFieldsSettingType[] = [
    {
      title: '事项标题/事项编号',
      field: 'businessKey',
      slot: 'businessKeySlot',
      minWidth: 200
    },
    {
      title: '当前环节',
      field: 'currentTaskName',
      slot: 'currentTaskNameSlot',
      width: 140
    },
    // {
    //   title: '处理环节',
    //   field: 'taskEndName',
    //   slot: 'taskEndNameSlot',
    //   width: 120
    // },
    {
      title: '发起人',
      field: 'startUser',
      // slot: 'startUserSlot',
      width: 140
    },
    {
      title: '发起时间',
      field: 'startTime',
      width: 180
    }
    // {
    //   title: '处理时间',
    //   field: 'taskEndTime',
    //   width: 180
    // }
  ]

  const tableFieldsSettingDue: TableFieldsSettingType[] = [
    {
      title: '事项标题/事项编号',
      field: 'businessKey',
      slot: 'businessKeySlot',
      minWidth: 200
    },
    {
      title: '当前环节',
      field: 'currentTaskName',
      slot: 'currentTaskNameSlot',
      width: 140
    },
    {
      title: '发起人',
      field: 'startUser',
      width: 140
    },
    {
      title: '超时时间',
      field: 'dueDate',
      width: 180
    },
    {
      title: '发起时间',
      field: 'startTime',
      width: 180
    }
  ]
  const tableFieldsSetting2: TableFieldsSettingType[] = [
    {
      title: '事项标题/事项编号',
      field: 'businessKey',
      slot: 'businessKeySlot',
      minWidth: 200
    },
    {
      title: '当前环节',
      field: 'currentTaskName',
      slot: 'currentTaskNameSlot',
      width: 140
    },
    {
      title: '处理环节',
      field: 'taskEndName',
      slot: 'taskEndNameSlot',
      width: 140
    },
    {
      title: '发起人',
      field: 'startUser',
      // slot: 'startUserSlot',
      width: 140
    },
    {
      title: '发起时间',
      field: 'startTime',
      width: 180
    },
    {
      title: '处理时间',
      field: 'taskEndTime',
      width: 180
    }
  ]
  return {
    // 头部右侧筛选项配置
    searchOptions,
    // 筛选项字段
    searchForm,
    // 表格配置
    tableOptions,
    tableFieldsSetting,
    tableFieldsSetting2,
    tableFieldsSettingDue
  }
}
